new Vue({
  el: '#app',
  data() {
    return {
      rules: {

      },
      StyleName: '',
      form: {
        index: {//首页
          Content: {//总背景
            backgroundColor: '#dc3545',//背景颜色//3cc49dbfd54c25406d606cfb4dcb22b.png
            backgroundImage: '/6c1e39e6b6bc4258537d8b6691d41e4.png',//背景图片
            backgroundSize: '100% auto',//尺寸
            backgroundRepeat: 'no-repeat',//是否重复渲染
            Logo: false,//logo展示
            pic: '',
          },
          TopTabs:{
						backgroundColor:'',
					},
          Icon: {//图标
            textColor: '#fff',//字体颜色
            backgroundColor: '',//背景颜色
            IconBackgroundColor:'',
          },
          Tabs: {//导航栏
            backgroundColor: '',//背景颜色
            textColor: '#fff',//字体颜色
            selectColor: '#dcdc08',//选中的字体颜色
            //区域
          },
          Detail: {//商品卡片
            backgroundColor: '#fff',//背景颜色
            themeColor: '#dcdc08',//主体颜色
          },
        },
        activity: {
          Content: {
            //总背景
            backgroundColor: "#dc3545",
            backgroundImage: "/6c1e39e6b6bc4258537d8b6691d41e4.png", //背景图片
            backgroundSize: "100% auto", //尺寸
            backgroundRepeat: "no-repeat", //是否重复渲染
            Logo: true, //logo展示
          },
          title: {
            //主标题
            color: "#fff",
          },
          subtitle: {
            //副标题
            color: "#fff",
          },
          Heading: {
            //商品卡片标题
            color: "#fff",
          },
          recommend: {
            //滑动区域背景颜色
            backgroundColor: "#f5f5f5",
          },
          scroll_view_item_H: {
            //商品卡片颜色
            backgroundColor: "#fff",
            color: "#fff",
          },
          markdown: {
            //降价
            color: "#000",
          },
        },
      },
      form1: {},
      Size: [{
        value: 'contain',
        label: '缩小图片来适应尺寸'
      }, {
        value: 'cover',
        label: '扩展图片来填满背景'
      }, {
        value: '100% auto',
        label: '宽度100%高度自适应'
      }],
      Repeat: [{
        value: 'repeat',
        label: '横向和纵向平铺'
      }, {
        value: 'repeat-x',
        label: '横向平铺'
      }, {
        value: 'repeat-y',
        label: '纵向平铺'
      }, {
        value: 'no-repeat',
        label: '不平铺'
      }],
      loading: false,
      dialogVisible: false,//图片放大展示
      dialogImageUrl: '',//图片地址
      activeName: 'index',
      formData: {
        Primary_Key_Name: "App_Style_SerialNumber",
        Primary_Key: "",
        Data: "enterprise_appid_style",
      },
      indexStyle: "123"
    }
  },
  mounted() {
    this.formData.Primary_Key = sessionStorage.getItem("App_Style_SerialNumber");
    this.get_original_value(this.formData);
    this.iframe.onload = function () {
      // iframe加载完成后要进行的操作  这里要等 iframe加载完毕
      let param = {
        token: "***"
      }
      this.iframe.contentWindow.postMessage(param, '*') //*号可以指定任意域名
    }
  },
  methods: {
    sendMessageToUniApp() {
      const iframe = document.getElementById('uni-app-iframe');
      iframe.contentWindow.postMessage(this.form, '*');
    },
    doAction() {
      document.getElementById('testIframe').onload = function () {
        test.window.postMessage('hello, child!', 'http://localhost:8081/#/');
      }
      // this.indexStyle = encodeURIComponent(JSON.stringify(this.form))
      // console.log(this.indexStyle);
      // console.log(decodeURIComponent(this.indexStyle));
    },
    handlePictureCardPreview(file) {//查看图片
      this.dialogVisible = true
      this.dialogImageUrl = file
    },
    handleRemove() {//删除
      this.form.index.Content.pic = ''
      this.form.index.Content.backgroundImage = ''
    },
    uploadImage(file) {
      let _this = this
      new Compressor(file, {
        quality: 1,
        success(file) {
          console.log(file.size)
          const formData = new FormData();
          formData.append('file', file, file.name);
          let oFileReader = new FileReader();
          oFileReader.readAsDataURL(file);
          oFileReader.onload = function (e) {
            $.ajax({
              type: 'POST',
              url: DomainName + '/FileList',
              data: {
                Data: e.target.result,
                DataLength: file.size,
                FileName: file.name
              },
              complete: function (XMLHttpRequest) {
                _this.loading = false
                if (XMLHttpRequest.getResponseHeader("REDIRECT") == "REDIRECT") {
                  window.parent.document.location.href = "../../../" + XMLHttpRequest.getResponseHeader("CONTENTPATH");
                }
              },
              success: function (Result) {
                if (Result.Status == "success") {
                  _this.form.index.Content.pic = e.target.result
                  _this.form.index.Content.backgroundImage = Result.Picture_Url
                  _this.$message.success('上传成功')
                } else {
                  _this.$message.error('上传失败')
                }
              },
              error: function () {
                _this.$message.error("操作失败，请稍后再试")
              },
              dataType: "json"
            });
          }
        },
        error(err) {
          console.log(err.message);
        },
      });
    },
    get_original_value(data) {
      let _this = this
      $.ajax({
        url: DomainName + '/getInquiryIDOriginal?token=' + $.cookie('token'),
        type: 'POST',
        data,
        success: function (res) {
          console.log(res);
          _this.StyleName = res[0].App_Style_Name
          _this.form = res[0].App_Style_JSON
          _this.form1 = res[0]
          console.log(_this.form);
        },
        complete: function (XMLHttpRequest) {
          _this.loading = false
          if (XMLHttpRequest.getResponseHeader("REDIRECT") == "REDIRECT") {
            window.parent.document.location.href = "../../../" + XMLHttpRequest.getResponseHeader("CONTENTPATH");
          }
        }
      })
    },
    submitForm(formName) {
      let _this = this
      _this.form1.App_Style_Name = _this.StyleName
      _this.form1.App_Style_JSON = JSON.stringify(_this.form);
      let data = {
        Data: JSON.stringify({
          Modify: { enterprise_appid_style: [_this.form1] }
        })
      };
      _this.$refs[formName].validate((valid) => {
        if (valid) {
          console.log(_this.form)
          _this.loading = true
          $.ajax({
            url: DomainName + '/getEditAction?token=' + $.cookie('token'),
            type: 'POST',
            data,
            success: function (res) {
              if (res.Result == "成功") {
                _this.$message({
                  message: '提交成功',
                  type: 'success'
                });
                window.history.go(-1);
              } else {
                _this.$message.error(res.Result);
              }
            },
            error: function () {
              console.log(error)
            },
            complete: function (XMLHttpRequest) {
              _this.loading = false
              if (XMLHttpRequest.getResponseHeader("REDIRECT") == "REDIRECT") {
                window.parent.document.location.href = "../../../" + XMLHttpRequest.getResponseHeader("CONTENTPATH");
              }
            }
          })
        }
        else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
  }
})